<template>
	<view>
		<view>列表页</view>
		<view class="box-item" v-for="(item, i) in list" :key="i">{{ item }}</view>
		<button @click="PullDown">刷新</button>
	</view>
</template>

<script>
export default {
	data() {
		return {
			list: ['前端', 'java', 'UI', '大数据', '后端', 'python', 'PS', '移动端', 'GO', 'C++', 'C']
		};
	},
	onPullDownRefresh() {
		console.log('触发了下拉刷新');
		setTimeout(() => {
			this.list = ['移动端', '后端', '大数据', 'UI'];
			uni.stopPullDownRefresh(); // 停止当前页面下拉刷新
		}, 1000);
	},
	onReachBottom() {
		// 页面滚动到底部的事件
		console.log('页面触底了');
		this.list = [...this.list, ...['移动端', '后端', '大数据', 'UI']];
	},
	methods: {
		PullDown() {
			uni.startPullDownRefresh(); // 点击刷新按钮进行下拉刷新
		}
	}
};
</script>

<style>
.box-item {
	height: 200rpx;
	line-height: 200rpx;
}
</style>
